$.fn.extend({
    //top 栏 的鼠标移入显示，移出隐藏方法
    initUser() {
        let userList = JSON.parse(localStorage.getItem("user") || "{}");
        if (userList.uname) {
            this.append(`
            <div class="user fl">
                        <a href="#">${userList.uname}</a>
                        <span></span>
                        <div>
                            <img src="./images/截屏2021-07-07 下午4.14.11.png" alt="">
                            <p>
                                <em>管理账号</em>
                                <em class="close_user">退出登录</em>
                            </p>
                        </div>
                    </div>
                    <div class="pl_register fl"><a href="#">消息</a></div>
            </div>
            `);
        } else {
            this.append(`
            <div class="fl">
                <div class="wcm_ali fl">
                    欢迎来到阿里巴巴
                </div>
                <div class="pl_login ms_top fl">
                    <img src="./images/hongbao.png" alt="">
                    <a href="login.html">请登录</a>
                    <div class="pl_l_box">
                        <p>先登录在采购，享受更多权益！</p>
                        <p>
                            <em>领取新人红包</em>
                            <em>享受新人权益</em>
                            <em>更多精准推荐</em>
                            <em>记录浏览足迹</em>
                        </p>
                        <em class="close_plbox">X</em>
                    </div>
                </div>
                <div class="pl_register fl"><a href="reg.html">免费注册</a></div>
             </div>
            `);
        }
        this.find(".close_user").on("click", () => {
            localStorage.removeItem("user");
            location.reload(true);
        })
    },
    initShop() {
        let self = this;
        $.ajax({
            url: "http://127.0.0.1:8080/allshop"
        }).then(function (res) {
            let { data } = res;
            for (let i = 0; i < 3; i++) {
                let sId = data[i].sId;
                self.children().eq(i).attr("href", `shop.html?sId=${sId}`);
                self.children().eq(i).find("img").attr("src", (data[i].sImg)[0]);
                self.next().children().eq(i).text(data[i].sName);
                self.next().next().children().eq(i).find("i").text(data[i].sPrice);
            }
        })
    },
    mouseTop() {
        this.on("mouseenter", function () {
            $(this).find("div").show();
            $(this).find("span").css({
                top: 0,
                right: -5,
                transform: "rotate(180deg)"
            })
        }).on("mouseleave", function () {
            $(this).find("div").hide();
            $(this).find("span").css({
                top: 2,
                right: 8,
                transform: "rotate(0deg)"
            })
        })
    },
    userMouseTop() {
        this.on("mouseenter", function () {
            $(this).find("div").show();
            $(this).find("span").css({
                top: -3,
                right: -26,
                transform: "rotate(180deg)"
            })
        }).on("mouseleave", function () {
            $(this).find("div").hide();
            $(this).find("span").css({
                top: 0,
                right: -14,
                transform: "rotate(0deg)"
            })
        })
    },
    //top栏登录下拉框中的关闭按钮
    closeLogin() {
        this.on("click", function () {
            $(this).parent().hide();
        })
    },
    //nav 下面的点击切换
    navClickTab() {
        this.on("click", function () {
            $(this).addClass("nav_current").siblings().removeClass("nav_current");
        })
    },
    //鼠标移入con1商品菜单显示更相信信息
    mouseShopMenu() {
        this.on("mouseenter", function () {
            $(this).next().show();
            $(this).next().css("display", "flex")
        }).on("mouseleave", function () {
            $(this).next().hide();
        })
        this.next().on("mouseenter", function () {
            $(this).show();
        }).on("mouseleave", function () {
            $(this).hide();
        })
    },
    slideshow() {
        class SlideShow {
            constructor(aa) {
                this.$lis = aa.find("li");
                this.$spans = aa.find("span");
                this.$arrow = aa.find(".arrow")
                this.liIndex = 0;
                this.spanIndex = 0;
                this.timer = null;
                this.length = 0;
                if (Array.from(this.$lis).length > 10) {
                    this.length = 3;
                } else {
                    this.length = 9;
                }
            }
            autoPlay() {
                this.liIndex++;
                if (this.liIndex == this.length) {
                    this.$lis.parent().css("left", "0");
                    this.liIndex = 1;
                }
                this.$lis.parent().stop(true).animate({ left: this.liIndex * -600 });
                this.spanIndex++;
                if (this.spanIndex == this.length - 1) {
                    this.spanIndex = 0;
                }
                this.$spans.eq(this.spanIndex).addClass("c1_lb_current").siblings().removeClass("c1_lb_current");
            }
            setInterv() {
                this.timer = setInterval(() => {
                    this.autoPlay();
                }, 1500);
                this.mouseEnter();
            }
            mouseEnter() {
                let self = this;
                this.$arrow.children().on("mouseenter", function () {
                    if (self.length != 3) {
                        $(this).addClass("c1_arrow-current");
                    }
                    clearInterval(self.timer);
                }).on("mouseleave", function () {
                    if (self.length != 3) {
                        $(this).removeClass("c1_arrow-current");
                    }
                    self.timer = setInterval(() => {
                        self.autoPlay();
                    }, 1500);
                }).on("click", function () {
                    if (self.length != 3) {
                        if (this.className == "c1_arrow_l c1_arrow-current" && self.spanIndex != 0) {
                            self.liIndex = self.spanIndex = self.spanIndex - 2;
                            self.autoPlay();
                        }
                        if (this.className == "c1_arrow_r c1_arrow-current" && self.spanIndex != 7) {
                            self.liIndex = self.spanIndex = self.spanIndex;
                            self.autoPlay();
                        }
                    } else {
                        if (this.className == "c1_nav_arrow_l" && self.liIndex != 0) {
                            self.liIndex = self.spanIndex = self.liIndex - 2;
                            self.autoPlay();
                        }
                        if (this.className == "c1_nav_arrow_r" && self.liIndex != 1) {
                            self.liIndex = self.spanIndex = self.liIndex;
                            self.autoPlay();
                        }
                    }

                })
                this.$spans.on("mouseenter", function () {
                    $(this).addClass("c1_lb_current").siblings().removeClass("c1_lb_current");
                    self.liIndex = self.spanIndex = $(this).index() - 1;
                    self.autoPlay();
                    clearInterval(self.timer);
                }).on("mouseleave", function () {
                    self.timer = setInterval(() => {
                        self.autoPlay();
                    }, 1500);
                })
            }


        }
        new SlideShow(this).setInterv();
    },
    fixSearch() {
        let elTop = this.offset().top;
        $(window).on("scroll", () => {
            if ($(window).scrollTop() >= elTop) {
                $("body").find(".fixed_search").show();
                this.css("margin-top", 90);
            } else {
                $("body").find(".fixed_search").hide();
                this.css("margin-top", 0);
            }
        })
    },
    mouseCe() {
        this.children().on("mouseenter", function () {
            $(this).children().eq(1).show();
        }).on("mouseleave", function () {
            $(this).children().eq(1).hide();
        })
        this.find(".go_top").on("click", function () {
            $("html").animate({ "scrollTop": 0 })
        })
    },
    mouseTab() {
        let self = this;
        this.find(".msTab").on("mouseenter", function () {
            // console.log($(this));
            $(this).find("span").addClass("c1r_b_current");
            $(this).siblings().find("span").removeClass("c1r_b_current");
            self.find("div").eq($(this).index()).addClass("c1r_b_current").siblings().removeClass("c1r_b_current");
        })
    }

})

$(function () {
    $("img").lazyload({ effect: "fadeIn" });
    $(".top_l").initUser();
    $(".con3_img").initShop();
})
window.onload = function () {
    $(".ms_top").mouseTop(); //top 栏 的鼠标移入显示，移出隐藏方法
    $(".close_plbox").closeLogin();//top栏登录下拉框中的关闭按钮
    $(".nav ul li").navClickTab();//nav 下面的点击切换
    $(".con1_l li").mouseShopMenu();//鼠标移入con1商品菜单显示更相信信息
    $(".con1_lb").slideshow();
    $(".con_nav").slideshow();
    $(".user").userMouseTop();
    $(".con1").fixSearch();
    $(".sidebar").mouseCe();
    $(".c1r_b").mouseTab();
}



